<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ include file="/commons/taglibs.jsp"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<title>Dragon Baby System</title>
		<%@include  file="/commons/head.jsp"%>
		<script src="${ctx}/js/fileupload/jquery.fileupload.js"></script>
		<script src="${ctx}/js/fileupload/jquery.fileupload-ui.js"></script>
		<script type="text/javascript">
		$(function() {
			// a workaround for a flaw in the demo system (http://dev.jqueryui.com/ticket/4375), ignore!
			$("#dialog:ui-dialog").dialog( "destroy" );
			$("#dialog-form").dialog({
				autoOpen: false,
				height: 300,
				width: 350,
				modal: true,
				buttons: {
					"Save": function() {
						//$("#dialog-form").
						$.ajax({
							url:"${ctx}/atta/atta!addComment.do",
							data:"id=" + $("#attaId").val() + "&comment=" + $("#comm").val(),
							dataType:"text",
							success: function(text) {
								$("#comm").val("");
								$("#dialog-form").dialog( "close" );
						}});
					},
					Cancel: function() {
						$("#comm").val("");
						$("#dialog-form").dialog( "close" );
					}
				}
			});
			$("a[name = create-descs]").click(function() {
				$("#attaId").val($(this).attr("value"));
				$( "#dialog-form" ).dialog( "open" );
			});
			var initFileUpload = function (suffix) {
		        $('#file_upload').fileUploadUI({
		            namespace: 'file_upload_' + suffix,
		            fileInputFilter: '#file_' + suffix,
		            dropZone: $('#drop_zone_' + suffix),
		            buildDownloadRow: function (file) {
		            	$("#allImg").val($("#allImg").val() + file.id + ",");
		            	$("#imgsDiv").append("<img src='${ctx}/atta/atta!down.do?id=" +  file.id + "' /> ");
		            }
		        });
		    };
		    initFileUpload(1);
		});
		</script>
	</head>
	<body>
		<div class="wrapper">
			<%@include file="/commons/header.jsp" %>
			<div class="content">
				<%@include file="/commons/menu.jsp" %>
				<div class="primary">
					<h1>附件管理</h1>
					<div id="dialog-form" title="增加注释" >
						<input id="attaId" type="hidden" value=""/>
						<textarea id="comm" style="width:300px;height:170px;"></textarea>
					</div>
					<table cellspacing="0" id="playlistTable" style="margin: 10px 0px;">
						<caption>附件列表</caption>
						<thead>
							<tr>
								<th id="playlistPosHead" scope="col">No</th>
								<th scope="col">文件名称</th>
								<th scope="col">文件大小</th>
								<th scope="col">创建时间</th>
							</tr>
						</thead>
						<tbody>
							<s:iterator status="sts" value="page.result">
								<tr>
									<td>${sts.index + 1}</td>
									<td><a href="atta!down.do?id=${id}" style="float:left;">${fileName}</a> <a name="create-descs" title="comment" style="float:left;" href="#" value="${id}" class="ui-icon ui-icon-clipboard"></a><a id="create-delete" title="delete" href="atta!delete.do?id=${id}" class="ui-icon ui-icon-closethick"></a> </td>
									<td>${size}</td>
									<td>${createDate}</td>
								</tr>
							</s:iterator>						
						</tbody>
						<tfoot>
							<tr><td colspan="5" align="right">
								<ui:page page="${page}" pageNum="10" />
							</td></tr>
						</tfoot>
					</table>
					<fieldset>
						<legend>
							附件上传
						</legend>
						<form id="file_upload" action="/ghtrade/atta/atta!upload.do" method="post" enctype="multipart/form-data">
						    <div id="drop_zone_1">
						        <input id="file_1" type="file" name="file" multiple />
						    </div>
						    <div id="imgsDiv"></div>
						</form>
					</fieldset>
				</div>
			</div>
			<%@include file="/commons/footer.jsp" %>
		</div>
	</body>
</html>
